import React, {Component} from 'react';
import './findPsd.less'
import Header from '../../../components/header/header'
import {Button} from 'antd-mobile';

class FindPsd extends Component {
    constructor(props) {
        super(props);
        this.state = {
            loginLoading: false,
            showImgCode: ''
        };
    }

    componentDidMount() {
        this.initData();
    }
    initData = async () => {
        // let result = await api.getImgCode();
        // this.setState({
        //     showImgCode: result.code
        // });
    };
    goSubmit = () => {
        this.setState({
            loginLoading: true
        });
    };
    getImgCode = () => {
        this.initData();
    };
    render() {
        return (
            <div className="findPsd">
                <Header title={"找回密码"}/>
                <ul className="ul-input">
                    <li><input style={{width: "100%"}} type="tel" placeholder={"请输入手机号码"}/></li>
                    <li><input style={{width: "100%"}} type="password" placeholder={"请输入新密码"}/></li>
                    <li><input style={{width: "100%"}} type="password" placeholder={"请确认新密码"}/></li>
                    <li>
                        <input style={{width: "60%"}} type="text" placeholder={"请输入图形验证码"}/>
                        <img className="imgCode"
                             alt=""
                             src={this.state.showImgCode} onClick={this.getImgCode}/>
                    </li>
                </ul>
                <div className="bottom">
                    {this.state.loginLoading ? <Button type="primary" disabled>确定修改</Button> :
                        <Button type="primary" onClick={this.goSubmit}>确定修改</Button>}
                </div>
            </div>
        );
    }
}

export default FindPsd;
